<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>选择机型</title>
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=3,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<link href="css/public/reset-html5.css" rel="stylesheet">
	<link href="css/public/mui.min.css" rel="stylesheet">
	<link href="css/wx-main.css?20161105" rel="stylesheet">
	<link rel="stylesheet" href="css/recycle_home.css">
</head>
<body>
	<div class="main-content white-bg" id="main">
		<div class="menu mui-content white-bg">
			<div v-for="b in brands" v-bind:class="{'active' : selectedBrand==b}" v-on:click="selectBrand(b)" v-text="b.b_name"></div>
		</div>
		
		<div class="phones">
			<div class="phone" v-for="p in versions" v-on:click="selectVersion(p)">
				<div class="mui-card">
					<div class="phone-cover"><img src="{{p.v_imgurl}}" alt=""></div>
					<div v-text="p.v_name"></div>
				</div>
			</div>
		</div>
	</div>
	<a href="tel:4000301388" class="phone_order"><img src="image/phone_order.png" alt=""></a>
	<script src="js/public/jquery-2.2.1.min.js"></script>
	<script src="js/public/mui.min.js"></script>
	<script src="../plugins/vue/vue.min.js"></script>
	<script src="js/phone.js?123"></script>
<script src="layer_mobile/layer.js"></script>
	<script>
		var vue = new Vue({
			el:'#main',
			data:{
				'versions':[],
				'brands':[],
				'selectedBrand':null
			},
			methods:{
				"selectBrand":function(brand){
					var thiz = this;
					thiz.selectedBrand = brand;
					this.versions = brand.version;
				},
				"selectVersion":function(version){
					window.location.href="recycle_phone.html?vid="+version.vid;
				}
			},
			ready:function(){
				var thiz = this;
				console.log(this);
				var index = layer.open({type: 2,shadeClose:false});
				$.get(apiRecycle+"index.php/Home/User/get_brand_version", {}, function(res){
					thiz.brands = res.data;
					if(thiz.brands && thiz.brands.length>0){
						thiz.selectBrand(thiz.brands[0]);
					}
					layer.close(index);
				}, "json");
			}
		});
	</script>
</body>
</html>